<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
    <script type="text/javascript">

    </script>
</head>
<div dojoType="dijit.form.Form" id="registrationForm" jsId="registrationForm" action="saveRegistration.htm" method="get">
 <div dojoType="dojox.layout.TableContainer" cols="1" id="tcRegistrationForm" customClass="labelsAndValues">
    <div dojoType="dijit.form.ValidationTextBox" title="User Name:" id="regUsername" name="description" trim="true"  
		 required="true" missingMessage="You must enter Username"></div>
    <div dojoType="dijit.form.ValidationTextBox" type="password" title="Password:" id="regPassword" name="pwd" trim="true" required="true" missingMessage="You must enter Password"></div>
    <div dojoType="dijit.form.ValidationTextBox" title="First Name:" id="regFirstname" name="firstname" trim="true" required="true" missingMessage="You must enter First name"></div>
    <div dojoType="dijit.form.ValidationTextBox" title="Last Name:" id="regLastname" name="lastname" trim="true" required="true" missingMessage="You must enter Last name"></div>
    <div dojoType="dijit.form.ValidationTextBox" title="Email:" id="regEmailid" name="emailid" regExp=".*@.*" missingMessage="Please check your email address."></div>
    <div dojoType="dijit.form.DateTextBox" title="BirthDate:" id="regBirthdate" name="birthdate"></div>
 </div>
 		<div dojoType="dijit.form.Button" type="Submit" id="regSubmitButton">								   
			Register
		</div>	
  		<div dojoType="dijit.form.Button" id="regCancelButton" onClick="dijit.byId('loadDiv').hide();" >Cancel</div>
 
</div>
<script type="text/javascript">
	function submitForm() {
		var button = dijit.byId("submitButton");
		dojo.connect(button, "onClick", function(event) {			
			 //Stop the submit event since we want to control form submission.
            event.preventDefault();
            event.stopPropagation();

            //The parameters to pass to xhrPost, the form, how to handle it, and the callbacks.
            //Note that there isn't a url passed.  xhrPost will extract the url to call from the form's
            //'action' attribute.  You could also leave off the action attribute and set the url of the xhrPost object
            //either should work.
            var xhrArgs = {
                form: dojo.byId("dataForm"),
                handleAs: "text",
                load: function(data) {
                    dojo.byId("response").innerHTML = "Form posted.";
                },
                error: function(error) {
                    //We'll 404 in the demo, but that's okay.  We don't have a 'postIt' service on the
                    //docs server.
                    dojo.byId("response").innerHTML = "Form posted.";
                }
            }
            //Call the asynchronous xhrPost
            dojo.byId("response").innerHTML = "Form being sent..."
            var deferred = dojo.xhrPost(xhrArgs);
		});
	}
	dojo.addOnLoad(submitForm);
</script>
